<template>
  <div>
         <!-- 头部部分 -->
    <header class="header">
      <h1>todos</h1>
      <input class="new-todo" 
      v-model.trim="inpName" 
      placeholder="请输入任务名称" 
      autofocus 
      @keydown.enter="getInp(inpName)"/>
    </header>
  </div>
</template>

<script>
export default {
  name: 'VueTodolistTodoHeader',

  data() {
    return {
      inpName:''
    };
  },
 methods:{
  getInp(hname){
    if(this.inpName === '') return 
    this.$emit('hgetInp',hname)
    this.inpName=''
  }
 }
};
</script>

<style lang="scss" scoped>

</style>